import React, { Component } from 'react';
import {message, Modal, Space} from "antd"
import {
    apiPhysicalExchangeRecordsPage,
    apiGetLotteryDrawTurntables,
    apiMergePhysicalRecordChecks,
    apiConsolidatePhysicalRecords
} from "@/request/lotteryTools";
import ThePagination from '@/components/ThePagination';
import TheQueryForm from '@/components/TheQueryForm';
import TheTable from '@/components/TheTable';
import TheButton from '@/components/TheButton';
import moment from 'moment';
const { confirm } = Modal;

class EntityRecord extends Component {
    constructor(props) {
        super(props);
        this.state = {
            columns: [
                {
                    title: "用户ID",
                    dataIndex: "memberId",
                    key: "memberId",
                },
                {
                    title: "用户昵称",
                    dataIndex: "nickName",
                    key: "nickName",
                },
                {
                    title: "活动名称",
                    dataIndex: "turntableName",
                    key: "turntableName",
                },
                {
                    title: "奖品名称",
                    dataIndex: "prizeName",
                    key: "prizeName",
                },
                {
                    title: "数量",
                    dataIndex: "count",
                    key: "count",
                },
                {
                    title: "状态",
                    dataIndex: "status",
                    key: "status",
                    render: (text, record) => {
                        let label = ""
                        switch (text) {
                            case 0:
                                label = '未合并'
                                break;
                            case 1:
                                label = '已合并'
                                break;
                            default:
                                break;
                        }
                        return label
                    }
                },
                {
                    title: "收货人",
                    dataIndex: "memberName",
                    key: "memberName",
                },
                {
                    title: "联系方式",
                    dataIndex: "memberPhone",
                    key: "memberPhone",
                },
                {
                    title: "收货地址",
                    dataIndex: "memberAddress",
                    key: "memberAddress",
                },
            ],
            dataSource: [],
            pageData: { pageNo: 1, pageSize: 10 },
            total: 0,
            queryForm: {},
            searchOption: [
                {
                    field: "lotteryDrawTurntableIds",
                    label: "活动",
                    placeholder: "请选择",
                    required: false,
                    rules: [],
                    type: "Select",
                    mode: 'multiple',
                    options: [],
                    txt: 'turntableName',
                    value: 'lotteryDrawTurntableId',
                    api: apiGetLotteryDrawTurntables,
                    otherConfig: {
                        optionFilterProp: 'children'
                    },
                },
                {
                    field: 'state',
                    label: '状态',
                    placeholder: '请选择',
                    required: false,
                    rules: [],
                    type: 'Select',
                    options: [{ value: '0', label: '全部' }, { value: '1', label: '未合并' }, { value: '2', label: '已合并' }],
                    defaultValue: '0'
                },
            ],
            selectedRowKeys: []
        }
    }
    componentDidMount() {
        this.getData()
    }

    getData = () => {
        let { pageNo, pageSize } = this.state.pageData;
        let { queryForm } = this.state;
        apiPhysicalExchangeRecordsPage({
            pageNo, pageSize, ...queryForm
        }).then(res=>{
            if (res.code === 0) {
                this.setState({
                    dataSource: res.data,
                    total: res.totalCount
                })
            }
        })

    }
    pageChange = (pageNo, pageSize) => {
        this.setState({
            pageData: {
                pageNo,
                pageSize
            }
        }, () => this.getData())
    }
    onReset() {
        this.setState({
            queryForm: {},
            selectedRowKeys: []
        }, () => {
            this.pageChange(1, 10)
        })
    }
    onFormSearch(values) {
        this.setState({
            queryForm: values,
            pageData: { pageNo: 1, pageSize: this.state.pageData.pageSize }
        }, () => {
            this.getData()
        })
    }
    onSelectChange = (selectedRowKeys, selectedRows) => {
        this.setState({
            selectedRowKeys: selectedRowKeys
        })
    }
    // 一键
    oneKeyMerge = () => {
        apiMergePhysicalRecordChecks({
            lotteryDrawPhysicalExchangeRecordsIds: this.state.selectedRowKeys
        }).then(res=>{
            if (res.code === 0){
                confirm({
                    title: '温馨提示',
                    content: <Space wrap>
                        <span>共计</span>
                        <span style={{color: 'red'}}>{res.data.totalOrderQuantity}</span>
                        <span>个可合并订单，预计合并后产生</span>
                        <span style={{color: 'red'}}>{res.data.preOrderQuantity}</span>
                        <span>个预订单</span>
                    </Space>,
                    onOk: async () => {
                        let res = await apiConsolidatePhysicalRecords({
                            lotteryDrawPhysicalExchangeRecordsIds: this.state.selectedRowKeys
                        })
                        if (res.code === 0){
                            message.success(res.data)
                            this.getData()
                            this.setState({
                                selectedRowKeys: []
                            })
                        }
                    },
                });
            }
        })
    }
    render() {
        const { columns, dataSource, pageData: { pageNo, pageSize }, total, searchOption, selectedRowKeys} = this.state;
        const rowSelection = {
            type: 'checkbox',
            selectedRowKeys,
            preserveSelectedRowKeys: true,
            onChange: this.onSelectChange,
            getCheckboxProps: (record) => {
                return {
                    disabled: record.status,
                }
            },
        };

        return <div className='p-layout-box'>
            <TheQueryForm ref={(ref) => (this.queryFormRef = ref)} show={true} option={searchOption} onReset={() => this.onReset()} onGetValues={(values) => this.onFormSearch(values)} >
                <TheButton haspermi={['winningRecord:entityRecord:oneKeyMerge']} type="default" size="middle" onClick={()=>this.oneKeyMerge()}>一键合并</TheButton>
            </TheQueryForm>
            <TheTable
                rowKey={"lotteryDrawPhysicalExchangeRecordsId"}
                scroll={{ x: 'max-content', y: '63vh' }}
                columns={columns}
                dataSource={dataSource}
                rowSelection={rowSelection}
            />
            <ThePagination
                pageNo={pageNo}
                pageSize={pageSize}
                total={total}
                showQuickJumper={true}
                pageSizeOptions={[10,50,100,300,500]}
                pageChange={this.pageChange}
            />
        </div>
    }
}

export default EntityRecord;
